<input hidden="hidden" id="navValue" value="Banner管理">
<div class="page-content">
    <div class="page-header">
        <h1>
            用户管理
            <small>
                <i class="ace-icon fa fa-angle-double-right"></i>
                用户列表
            </small>
            <button type="button" class="btn btn-purple btn-sm" onclick="location='{:url("banner/add")}'">
            <span class="ace-icon fa fa-plus-circle icon-on-right bigger-110"></span>
            添加Banner
            </button>
        </h1>
    </div><!-- /.page-header -->

    <div class="row">
        <div class="col-xs-12">
            <!-- PAGE CONTENT BEGINS -->
            <div class="row">
                <div class="col-xs-12">
                    <table id="simple-table" class="table  table-bordered table-hover">
                        <thead>
                        <tr>
<!--                            <th class="center">-->
<!--                                <label class="pos-rel">-->
<!--                                    <input type="checkbox" class="ace" />-->
<!--                                    <span class="lbl"></span>-->
<!--                                </label>-->
<!--                            </th>-->
                            <th class="detail-col">图片</th>
                            <th>连接地址</th>
                            <th>标题</th>
                            <th class="hidden-480">说明</th>
                            <th class="hidden-480">状态</th>

                            <th>操作</th>
                        </tr>
                        </thead>

                        <tbody>
                        {volist name='list' id='val' }
                        <tr>
<!--                            <td class="center">-->
<!--                                <label class="pos-rel">-->
<!--                                    <input type="checkbox" class="ace" />-->
<!--                                    <span class="lbl"></span>-->
<!--                                </label>-->
<!--                            </td>-->

                            <td class="center">
                                <div class="action-buttons">
                                    <a href="#" class="green bigger-140 show-details-btn" title="Show Details">
                                        <i class="ace-icon fa fa-angle-double-down"></i>
                                        <span class="sr-only">Details</span>
                                    </a>
                                </div>
                            </td>

                            <td>
                               {$val->link}
                            </td>
                            <td>{$val->title}</td>
                            <td>{$val->desc}</td>

                            <td class="hidden-480">
                                {if $val->status==1}
                                <span class="label label-sm label-warning">显示</span>
                                {else/}
                                <span class="label label-sm label-info">隐藏</span>
                                {/if}
                            </td>

                            <td>
                                <div class="hidden-sm hidden-xs btn-group text-center">
                                    <button class="btn btn-xs btn-info" onclick="updateFun()">
                                        <i class="ace-icon fa fa-pencil bigger-120"></i>
                                    </button>

                                    <button class="btn btn-xs btn-danger" onclick="delFunc({$val->id})" >
                                        <i class="ace-icon fa fa-trash-o bigger-120"></i>
                                    </button>
                                </div>

                                <div class="hidden-md hidden-lg">
                                    <div class="inline pos-rel">
                                        <button class="btn btn-minier btn-primary dropdown-toggle" data-toggle="dropdown" data-position="auto">
                                            <i class="ace-icon fa fa-cog icon-only bigger-110"></i>
                                        </button>

                                        <ul class="dropdown-menu dropdown-only-icon dropdown-yellow dropdown-menu-right dropdown-caret dropdown-close">
                                            <li>
                                                <a href="#" class="tooltip-info" data-rel="tooltip" title="View">
																			<span class="blue">
																				<i class="ace-icon fa fa-search-plus bigger-120"></i>
																			</span>
                                                </a>
                                            </li>

                                            <li>
                                                <a href="#" class="tooltip-success" data-rel="tooltip" title="Edit">
																			<span class="green">
																				<i class="ace-icon fa fa-pencil-square-o bigger-120"></i>
																			</span>
                                                </a>
                                            </li>

                                            <li>
                                                <a href="#" class="tooltip-error" data-rel="tooltip" title="Delete">
																			<span class="red">
																				<i class="ace-icon fa fa-trash-o bigger-120"></i>
																			</span>
                                                </a>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </td>
                        </tr>

                        <tr class="detail-row">
                            <td colspan="8">
                                <div class="table-detail">
                                    <div class="row">
                                        <div class="col-xs-12 col-sm-12">
                                            <div class="text-center">
                                                <img class="thumbnail inline no-margin-bottom" style="width: 100%" alt="Domain Owner's Avatar" src="{$val->img}" />
                                                <br />
                                                <div class="width-80 label label-info label-xlg arrowed-in arrowed-in-right">
                                                    <div class="inline position-relative">
                                                        <a class="user-title-label" href="#">
                                                            <i class="ace-icon fa fa-circle light-green"></i>
                                                            &nbsp;
                                                            <span class="white">图片展示</span>
                                                        </a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div><!-- /.span -->
            </div><!-- /.row -->

            <div class="hr hr-18 dotted hr-double"></div>
            <!-- PAGE CONTENT ENDS -->
        </div><!-- /.col -->
    </div><!-- /.row -->

</div>

<script type="text/javascript">
    jQuery(function($) {
        /***************/
        $('.show-details-btn').on('click', function(e) {
            e.preventDefault();
            $(this).closest('tr').next().toggleClass('open');
            $(this).find(ace.vars['.icon']).toggleClass('fa-angle-double-down').toggleClass('fa-angle-double-up');
        });
        /***************/
    })

    function delFunc(id) {
        layer.confirm('<center>确定删除该banner ?</center>',{
            btn:['删除','取消'],
            title:'提示'
        },function () {
            $.post(location.href,{id:id},function (json) {
                layer.msg(json.info);
                if(json.status){
                    setTimeout(function () {
                        location.href = location.href;
                    },2000);
                }
            },'json');
        });

    }

    function updateFun(id) {
        layer.msg('未开发修改功能');

    }
</script>